<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"
	language="java"%>
<%@ taglib prefix="s" uri="/struts-tags"%>

<h2>Thông tin dịch vụ sân bóng</h2>

<form action="addServiceOrder" method="get">
	<input type="submit" value="Thêm dịch vụ" />
</form>
<jsp:include page="serviceOrderForm.jsp"></jsp:include>
<hr>
<div class="list-table">
	<h2>Danh sách dịch vụ sân bóng</h2>
	<table id="ver-zebra">
		<colgroup>
			<col class="vzebra-odd" />
			<col class="vzebra-even" />
			<col class="vzebra-odd" />
			<col class="vzebra-even" />
			<col class="vzebra-odd" />
		</colgroup>
		<thead>
			<tr>
				<th scope="col" id="vzebra-comedy">Chọn</th>
				<th scope="col" id="vzebra-adventure">Dịch vụ</th>
				<th scope="col" id="vzebra-adventure">Đơn giá (VND)</th>
				<th scope="col" id="vzebra-adventure">Số lượng</th>
				<th scope="col" id="vzebra-adventure">Tổng tiền (VND)</th>
			</tr>
		</thead>
		<tbody>
			<s:if test="%{listServiceOrder.isEmpty()}">
				<tr>
					<td colspan="8">Chưa có dữ liệu</td>
				</tr>
			</s:if>
			<s:else>
				<s:iterator value="listServiceOrder">
					<tr>
						<td><input type="radio" name="select" id="select"
							onchange="resetValidate()"
							onfocus="setServiceOrder('<s:property value="id"/>','<s:property value="service.id" />','<s:property value="getPrice(unitPrice)" />','<s:property value="number_items" />','<s:property value="getPrice(unitPrice*number_items)" />')" /></td>

						<td><s:property value="service.name" /></td>
						<td><s:property value="getPriceFormat(unitPrice)" /></td>
						<td><s:property value="number_items" /></td>
						<td><s:property value="getPriceFormat(unitPrice*number_items)" /></td>
					</tr>
				</s:iterator>
			</s:else>
		</tbody>
	</table>
</div>

<script type="text/javascript">
	function setServiceOrder(id, serviceId, unitPrice, number_items, total) {
		$('#id').val(id);
		$('#serviceId').val(serviceId);
		$('#unitPrice').val(unitPrice);
		$('#number_items').val(number_items);
		$('#total').val(total);
		
		return false;
	}
	
	function resetValidate() {
		$('#error_message').css('display', 'none');
		$('label.error').hide();
		$('.error').removeClass('error');
	}
</script>
